<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="keywords" content="穿山甲机器人股份有限公司,机器人后台管理系统,机器人后台数据统计" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>机器人-后台</title>
    <link href="css/main.css" rel="stylesheet" />
    <link href="css/logView.css" rel="stylesheet" />
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css">

    <!-- 可选的Bootstrap主题文件（一般不用引入） -->
    <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="css/lyz.calendar.css">
    <script src="js/jquery-2.1.1.min.js"></script>
    <script src="js/lyz.calendar.min.js"></script>

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
    <script src="js/logView.js"></script>
</head>

<body>
<div id="header">
    <div id="info">
        <h3><a href="#"><img src="img/csjlog.png" style="height: 40%;width: auto"></a>&nbsp;&nbsp;<span>穿山甲机器人后台数据管理系统</span></h3>
    </div>
</div>
<div id="content">
    <div id="con_left">
        <!--左侧菜单栏-->
        <ul id="left_nav">
            <li id="user_info">
                <div id="info_plane">
                    <a href="#"><img src="img/t11.jpg"></a>
                    <div id="users">
                       <span id="user_name">
                           <a href="#">微微一笑很倾城</a>
                       </span>
                        <span id="user_type">
                           <a href="#">超级管理员</a><b class="caret"></b>
                       </span>
                    </div>
                </div>
            </li>
            <li id="index_bt" class="nav_li">
                <i class="glyphicon glyphicon-home"></i><a href="index.html">主页</a>
            </li>
            <li id="market_bt" class="nav_li">
                <i class="glyphicon glyphicon-picture"></i><a href="mapView3.html">销售情况</a>
            </li>
            <li id="bg_data" class="nav_li">
                <i class="glyphicon glyphicon-th-list"></i><a href="real-time-data.html">后台数据</a>
            </li>
            <li class="index_li nav_li" id="robot_bt">
                <i class="glyphicon glyphicon-list-alt"></i><a href="state.html">机器人状态</a>
            </li>
            <!--<li id="one_info">
                <i class="glyphicon glyphicon-th"></i><a href="#">详细信息</a>
            </li>
            <li id="robot_log">
                <i class="glyphicon glyphicon-list"></i><a href="#">日志</a>
            </li>-->
        </ul>
    </div>
    <div id="con_center">
        <div id="log_view">
            <div id="log_top">
                <h3>操作日志</h3>
                <p><span>日志</span>&nbsp;/&nbsp;<strong>统计表格</strong></p>
            </div>
            <div id="log_center">
                <div class="tab">
                    <h4>表格</h4>
                    <div id="log_menu">
                        <div class="robot_id">
                            <span>机器人ID：</span><strong>1001</strong>
                        </div>
                        <div class="operate_result">
                            <span>操作结果：</span>
                            <select>
                                <option>全部</option>
                                <option>成功</option>
                                <option>失败</option>
                            </select>
                        </div>
                        <div class="operate_time">
                            <span>开始时间：</span>
                            <input type="text" name="s_time" id="txtBeginDate">&nbsp;&nbsp;
                            <span>结束时间：</span>
                            <input type="text" name="e_time" id="txtEndDate">
                        </div>
                        <script>
                            $(function () {
                                $("#txtBeginDate").calendar({
                                    controlId: "divDate",                                 // 弹出的日期控件ID，默认: $(this).attr("id") + "Calendar"
                                    speed: 200,                                           // 三种预定速度之一的字符串("slow", "normal", or "fast")或表示动画时长的毫秒数值(如：1000),默认：200
                                    complement: true,                                     // 是否显示日期或年空白处的前后月的补充,默认：true
                                    readonly: true,                                       // 目标对象是否设为只读，默认：true
                                    upperLimit: new Date(),                               // 日期上限，默认：NaN(不限制)
                                    lowerLimit: new Date("2016/01/01"),                   // 日期下限，默认：NaN(不限制)
                                    callback: function () {                               // 点击选择日期后的回调函数
                                        // alert("您选择的日期是：" + $("#txtBeginDate").val());
                                    }
                                });
                                $("#txtEndDate").calendar();
                                $("#txtBeginDate").click(function () {
                                    $("#divDate").css("left","30%");
                                });
                                $("#txtEndDate").click(function () {
                                    $("#txtEndDateCalendar").css("left","43%");
                                });
                            });
                        </script>
                        <div class="operate_bt">
                            <button id="o_search">搜索</button>
                            <button id="o_refresh">刷新</button>
                        </div>
                    </div>
                    <div class="table-responsive">
                        <table class="table">
                            <thead>
                            <tr>
                                <td>序号</td>
                                <td>操作日期</td>
                                <td>日志详情</td>
                                <td>操作结果</td>
                                <td>其他</td>
                            </tr>
                            </thead>
                            <tbody></tbody>
                        </table>
                    </div>
                </div>
                <!--表格页码-->
                <div id="log_page">
                    <nav>
                        <ul class="pagination pagination-sm"></ul>
                    </nav>
                </div>
            </div>
        </div>
    </div>


</div>
<!--遮罩层-->
<div id="fade">
    <div class="loader">
        <div class="loader-inner line-scale-pulse-out">
            <div></div>
            <div></div>
            <div></div>
            <div></div>
            <div></div>
        </div>
    </div>
</div>
<script>
    $(function () {
        setTimeout(function () {
            $("#fade").fadeOut(500);
        },500);
    })
</script>
</body>

</html>